<template>
  <div class="custom-sms">
    <div class="header-msg flex">
      <div class="info-detail">
        <Icon type="ios-information-circle" class="info-icon" size="18" />
        <span>您可以在这里发送节假日祝福短信、企业通知等自定义短信内容。</span>
        <span></span>
      </div>
      <Icon type="ios-close" size="24" />
    </div>

    <div class="sms-info">
      <span class="title">当前企业短信额度：</span>
      <span class="balance">0条</span>
      <span class="textLink">购买更多?</span>
      <span class="textLink last">查看发送记录</span>
    </div>

    <div class="sms-send">
      <Row class="send-row">
        <Col span="2">
          发送员工
          <Icon type="ios-help" size="24" />
        </Col>
        <Col span="22">
          <Button type="success">选择员工</Button>
        </Col>
      </Row>
      <Row class="send-row">
        <Col span="2">短信模版</Col>
        <Col span="22">
          <Input
            v-model="value17"
            maxlength="100"
            show-word-limit
            type="textarea"
            placeholder="Enter something..."
            :rows="6"
          />
        </Col>
      </Row>
      <Row class="send-row">
        <Col span="2">
          短信签名
          <Icon type="ios-help" size="24" />
        </Col>
        <Col span="22">
          <Button type="success">【人事部】</Button>
        </Col>
      </Row>
      <Row class="send-row">
        <Col span="2">发送时间</Col>
        <Col span="4">
          <Radio :value="true"></Radio>定时发送
        </Col>
        <Col span="5">
          <DatePicker type="date" placeholder="选择日期" style="width: 200px"></DatePicker>
        </Col>
        <Col span="4">
          <TimePicker :value="value1" format="HH点" placeholder="选择时间"></TimePicker>
        </Col>
      </Row>
      <Row class="send-row">
        <Col span="2">
          <span class="hidden">hidden</span>
        </Col>
        <Col span="22">
          <Button type="success">预览短信</Button>
        </Col>
      </Row>
    </div>

    <div class="operate-guide">
      <h3>温馨提示：</h3>
      <p>1.短信内容审核通过后，系统会跟据您所设置的短信发送时间定时发送</p>
      <p>2.如您的短信审核被驳回，将会以短信形式告知您；会自动将您的短信余额返回到您的账户</p>
      <p>3.可在发送记录查看或撤回短信</p>
      <p>
        4.如需申请企业专属短信签名，请点击查看：
        <a>如何申请短信签名？</a>
      </p>
    </div>
  </div>
</template>
<style lang="scss" scoped src="../index.scss">
</style>